<template>
  <div class="flex flex-col h-full">
    <a-card>
      <div class="flex items-center">
        <a-button class="mr-5" type="primary" @click="router.go(-1)">返回</a-button>
        <a-descriptions class="mt-4" :column="3">
          <a-descriptions-item label="收费标准">{{ formState.chargeStdName }}</a-descriptions-item>
          <a-descriptions-item label="创建人">{{ formState.empName }}</a-descriptions-item>
          <a-descriptions-item label="创建时间"> {{ formState.createTime }}</a-descriptions-item>
        </a-descriptions>
      </div>
    </a-card>
    <a-card class="mt-2 flex-1">
      <BaseTable
        :data-source="dataSource"
        column-code="00001182"
        :loading="loading"
        max-fill
        :extra-height="64"
        :row-class-name="(record) => (record.isNew ? 'table-row-new' : '')"
      >
        <template #bodyCell="{ column, index, record }">
          <template v-if="column.dataIndex === 'xh'">
            {{ index + 1 }}
          </template>
          <template v-if="column.dataIndex === 'xmmc'">
            <EditCell title="项目">
              <!-- <SelectTable v-model:value="record.mc" type="采购" @select="(medicine) => onSelectMedicine(medicine, record)" /> -->
              <SelectMedicine :value="{ mc: record.mc, gg: record.sfxm?.gg, cj: record.sfxm?.cj }" type="收费标准" @select="onSelectMedicine($event, record)" />
            </EditCell>
          </template>
          <template v-if="column.dataIndex === 'jsdj'">
            <EditCell title="结算单价">
              <a-input v-model:value="record.chargeStdPrice" v-input-selection class="text-right" placeholder="请输入" @blur="editRow(record)" />
            </EditCell>
          </template>
          <template v-if="column.dataIndex === 'memo'">
            <EditCell title="备注">
              <a-input v-model:value="record.memo" v-input-selection placeholder="请输入" @blur="editRow(record)" />
            </EditCell>
          </template>
          <template v-if="column.dataIndex === 'action'">
            <BaseButton confirm-text="确认删除？" type="text" danger size="small" @click="onDelete(record)">删除</BaseButton>
          </template>
        </template>
        <template #footer>
          <div class="text-center sticky bottom-0">
            <a-button class="mr-2" @click="addRow()"> 新增一行 </a-button>
            <a-button type="primary" :disabled="dataSource.length === 0" @click="saveNewRows()"> 保存 </a-button>
          </div>
        </template>
      </BaseTable>
    </a-card>
  </div>
</template>

<script setup>
import { ref, watchEffect } from 'vue'
import { message } from 'ant-design-vue'
import { useRouter, useRoute } from 'vue-router'
import { post } from '@/utils/request'
import BaseTable from '@/components/BaseTable'
import EditCell from '@/components/EditCell'
import BaseButton from '@/components/BaseButton'
import SelectMedicine from '@/components/SelectMedicine'

const router = useRouter()
const route = useRoute()
const dataSource = ref([])
const loading = ref(false)
const formState = ref({})
const editRow = (row) => !row.isNew && fetchSave(row)
const fetchSave = async (row) => {
  if (row.sfxm) {
    row.chargeStdId
    delete row.sfxm
  } else {
    row.chargeStdId = route.query?.id
  }
  const { code, msg } = await post('/operation/chargeStandard/doSaveChargeStandardltem', row)
  if (code !== 0) return message.error(msg || '操作失败')
  getDetailData()
  message.destroy()
  message.success(row.isNew ? '新增成功' : '修改成功')
}

const onSelectMedicine = (medicine, row) => {
  row.mc = medicine?.mc
  row.sfxmbBh = medicine?.bh
  row.gg = medicine?.gg
  row.dw = medicine?.dw
  row.dj = medicine?.dj
  row.chargeStdPrice = medicine?.dj
  row.xmlb = medicine?.lbmc
  editRow(row)
}

const saveNewRows = async () => {
  const newRow = dataSource.value.filter((item) => item.isNew)
  newRow.forEach((item) => {
    if (item.sfxmbBh && item.chargeStdPrice) {
      fetchSave(item)
    } else {
      message.destroy()
      message.error('请填写完整信息')
    }
  })
}

const getData = async () => {
  const res = await post('/operation/chargeStandard/getChargeStandardList', { pyjm: route.query?.id, pageNum: 1, pageSize: 9999 })
  if (res.code !== 0) return message.error(res.msg)
  formState.value = res.data[0]
}
const getDetailData = async () => {
  const { code, data, msg } = await post('/operation/chargeStandard/getChargeStandardltemList', { chargeStdId: route.query?.id })
  if (code !== 0) return message.error(msg)
  dataSource.value = data
}

const addRow = () => {
  const key = `row-${dataSource.value.length}`
  const addRow = { key, isNew: true }
  dataSource.value.push(addRow)
}
const onDelete = async (row) => {
  if (row.isNew) {
    dataSource.value = dataSource.value.filter((item) => item.key !== row.key)
  } else {
    const { code, msg } = await post('/operation/chargeStandard/doDelChargeStandardltem', { id: row.id })
    code === 0 ? getDetailData() : message.error(msg || '删除失败')
  }
}

watchEffect(() => {
  if (route && route.query?.id) {
    getData()
    getDetailData()
  }
})
</script>

<style lang="less" scoped></style>
